<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <style></style>
  </head>
  <body>
    <div>
      <h1>Webpack-MiniCssExtractPlugin</h1>
      <p>提取CSS到单个文件,通过这个插件就可以实现CSS按需加载</p>
      <p>yarn add mini-css-extract-plugin</p>
      <p>安装完成后再webpack.config.js中导入这个插件</p>
      <p>const MiniCssExtractPlugin = require('mini-css-extract-plugin')</p>
      <p>然后添加到plugin对象的数组中</p>
      <p>plugin:[ new MiniCssExtractPlugin()]</p>
      <p>并且去掉之前使用的style-loader</p>
      <p>
        取而代之的是MiniCssExtractPlugin.loader（他是使用link的方式）（这个插件不需要额外的安装）
      </p>
    </div>
    <script></script>
  </body>
</html>
